files
- BookCover.tsx
- BookCard.tsx

This should not affect any other current files, but clears up possible confusion and prevents case errors.

To ensure naming consistency across project. Also update files where these are imported, so they are referenced correctly.

Functions changed:
- App.tsx
- AppShell.tsx

Imports updated:
- App.tsx
- main.tsx

Change all occurences of "Prop" to "ComponentNameProp".  Should not affect any other files - all instances are internal to each file.

Affected files:
- BookCover.tsx
- SearchField.tsx
- BrowseIcon.tsx
- ChevronIcon.tsx
- FilterIcon.tsx
- LogoIcon.tsx
- RibbonIcon.tsx
- SearchIcon.tsx
- ShelfIcon.tsx
- SparkeIcon.tsx
- StarIcon.tsx

FIle: SearchIcon.tsx
Also update imports used in other files to reflect this: SearchField.tsx

To avoid confusing these with the "My shelf" page.

Affected files:
- BookCard.module.css
- BookCard.tsx
- BookGrid.module.css
- BookGrid.tsx
- tokens.css

Previously living inside BookCard.tsx, now it's own file. Change relevant sections in related files.

Why: To allow reuse of ribbon button by other parts of the app (mainly Book Detail Page).

New files:
- ShelfRibbon.tsx
- ShelfRibbon.module.css

Modified files:
- BookCard.tsx
- BookCard.module.css

`--color-chip-bg` changed to more correct `color-header-tint` in SearchField.module.css

Allows recoloring of actual color chip bg without inadvertently changing other elements.

For consistency and central management

- Button.tsx
- Button.module.css

Add a text-only button for various uses across the app (such as "remove rating" on detail page). Default values for button are the same as before, it should not impact any other current files.

At the same time clean up hardcoded .css values, replace with var() from tokens.css

What a weird name for this thing...
- Eyebrow.tsx
- Eyebrow.module.css

For use in book detail page.

Why and when it triggers:

Removing book from your shelf also deletes your rating and notes

Deleting notes cannot be undone

The popup is handled by the app itself, overwriting some of the automatic behavior in the browser.

Includes:
- Current rating, interactive, can be changed by just clicking the stars.
- Button to remove rating
- Note status / existing note
- Text box to write note when creating new/editing
- Buttons to create note, save or discard drafted note, delete existing note.

Note: You cannot save a note with zero text. If you want to remove a note, you need to cancel any current edit/draft, and instead click "delete note"

Uses newly created components. Based on visual mockup from planning phase.

TEMPORARY:
- Uses mockBooks.ts instead of real query to backend. This includes mapping of mock books currently in .json file in /server, plus a temp shelf entry type.
- "Book not found" only works with static list of books - must be replaced with dynamic error/loading state management when linked with real backend.
- Sets updatedAt date itself for user notes. this should be done by the server
- Language currently shows "en", not full language. Have to see how this behaves with actual date, perhaps add a converter util to do "en" -> "English"
- Max length of user note is handled by MyNotesPanel.tsx, needs to be validated by server as well
- Remove book from shelf -> deletes rating and note. Should be a single backend operation (cascade delete), not three separate calls from the client. Beware.

App.tsx now calls on the new page instead of the placeholder.

Update dependent imports to reflect this change.

Note: Checked that `npm run build` does not throw errors at this stage. Neat.